<template>
	<view class="main">
		<view class="mid">
			<view class="top"
				style="margin-top: 14px;margin-left: 16px;margin-right:16px;display:flex;justify-content: space-between;">
				<view>
					<text style="font-size: 14px;color: #999999;font-family: 'PingFang SC';">巡检情况</text>
				</view>
				<view>
					<u-radio-group :disabled="radioSwitch" v-model="radioStatus" activeColor="#FF5000">
						<u-radio :name="0">正常</u-radio>
						<u-radio :name="1" style="margin-left: 10px;">异常</u-radio>
					</u-radio-group>
				</view>
			</view>
			<div style="margin-top: 12px;">
				<u-line></u-line>
			</div>
			<view class="mid" style="margin-top: 16px;margin-left: 16px;">
				<text style="font-size: 14px;color: #999999;font-family: 'PingFang SC';">巡检内容</text>
				<u--textarea v-model="resultText" :disabled="textSwitch" placeholder="此处输入信息" count height="105px"
					maxlength='2000' style="margin-top: 8px;margin-right: 16px;"></u--textarea>
			</view>
			<div style="margin-top: 10px;">
				<u-line></u-line>
			</div>
			<view class="bottom" style="margin-top: 17px;margin-left: 16px;">
				<text style="font-size: 14px;color: #999999;font-family: 'PingFang SC';">现场照片</text>
			</view>
			<view class="imgs" style="display: flex;flex-direction: column;padding: 10px 16px 20px 16px;">
				<view class="img" :style="getWidth()" v-for="(item,index) in fileList" :key="index">
					<img :src="item.url" :style="getImageStyle()" />
				</view>
			</view>
			<view class="btn" style="margin-top: 24px;margin-left: 16px;margin-right: 16px;">
				<u-button text="返 回" @click="returnPage" color="#FF5000" plain
					style="margin-top: 8px;border-radius: 4px;"></u-button>
			</view>
		</view>
	</view>
</template>

<script>
	import croods from '@/common/croods-1.3.3.js';
	window.croods = croods;
	window.hydra = require('../../../common/wst_hydra-1.0.0.js');


	import coordtransform from 'coordtransform';
	import {
		getDetail
	} from '@/common/api.js'
	export default {
		onLoad: function(option) {
			this.recordId = option.recordId
		},
		onShow() {
			this.getDeviceDetail(this.recordId)
			document.body.style.overflow = 'auto';
		},
		data() {
			return {
				recordId: null,
				/* 页面控制 */
				radioSwitch: true,
				textSwitch: true,
				runSwitch: true,
				uploadSwitch: true,
				/* 结果 */
				radioStatus: null,
				resultText: '',
				fileList: [],
			}
		},
		methods: {
			returnPage() {
				uni.navigateBack({
					delta: 1 // 返回上一级页面
				});
			},
			getDeviceDetail(id) {
				getDetail({
					id: id
				}).then(response => {
					const temp = response
					this.radioStatus = temp.sfyc
					this.resultText = temp.xjms
					this.fileList = temp.xjfjList
				})
			},
			getWidth() {
				let a = uni.getSystemInfoSync().windowWidth
				let b = a - 32
				return {
					'width': b + 'px'
				}
			},
			getImageStyle() {
				let a = uni.getSystemInfoSync().windowWidth
				let b = a - 32
				return {
					'width': b + 'px',
					'height': 'auto',
					'object-fit': 'cover',
					'padding-top': '5px'
				}
			}
		},
		mounted() {

		}
	}
</script>

<style>
	.main {
		background-color: #FAFAFA;
		width: 100vw;
		height: 80vh;
		overflow-y: hidden;
	}
</style>